<template>
	<view class="fans-page init-page">
		<!-- #ifndef MP-WEIXIN -->
		<myuni-topbar>
		  <template v-slot:title>
			<text>粉丝</text>
		  </template>
		</myuni-topbar>
		<!-- #endif -->
		<view class="fans-list">
			<navigator :url="'/pages/user/fansinfo?id='+item.userId" class="fans-list-item" v-for="item in followeds" :key="item.userId">
				<image :src="item.avatarUrl" :lazy-load="true" mode="widthFix"></image>
				<view class="right-info">
					<text class="name ft">{{item.nickname}}</text>
				</view>
			</navigator>
		</view>
	</view>
</template>

<script>
	import { mapState } from 'vuex';
	export default{
		data(){
			return{
				uid:'',
				page:0,
				followeds:[]
			}
		},
		onLoad(option) {
			this.uid=option.id
			this.getFans()
		},
		computed:{
			...mapState(['cookie'])
		},
		methods:{
			getFans(){
				this.request({
					url:"/user/followeds?uid="+this.uid+"&offset="+this.page*30
				}).then(res=>{
					this.followeds=res.followeds
					console.log(this.followeds)
					this.page++
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	.fans-page{
		.fans-list{
			.fans-list-item{
				margin: 20rpx 0;
				display: flex;
				border-radius: 20rpx;
				overflow: hidden;
				image{
					width: 100rpx;
					height: 100rpx;
				}
				.right-info{
					padding: 0 50rpx;
					display: flex;
					flex-direction: column;
					justify-content: space-around;
					.name{
						font-size: 32rpx;
					}
				}
			} 
		}
	}
	
</style>
